import React from "react";

// 后台管理的home页
export default class PropsDemo extends React.Component {
  constructor(props){
    super(props)
    console.log(this.props)
    this.state={
      num:15
    }
  }
  // static propTypes={
  //   obj:PropTypes.object.isRequired
  // }
  
  handleState=(val,e)=>{
    val=val+e.target.value
    this.setState({
      num:val
    })
  }

  render() {
   let ele=this.props.arr.map(item=>{
      return (
        <li>
                <span>
                  姓名:{item.name}  
                </span>
                <span>
                  年龄:{item.age}
                </span>
              </li>
      )
    })
    return (
      <div>

          <ul>
              {ele}
          </ul>
          <h1>
          ---{this.state.num}
          </h1>

          {/* 事件名代表返回的必须是一个函数 */}
          <button onClick={this.handleState}>我是个传参函数</button>
          <input type="text" onChange={(e)=>{this.handleState("111",e)}} placeholder="我是会和原来的num不断相加的实时监听事件" />
      </div>
    );
  }
}
